<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%String path = request.getContextPath();%>
<%@ taglib uri="/WEB-INF/tld/c.tld" prefix="c" %>
<%@ taglib uri="/WEB-INF/tld/ui.tld" prefix="ui" %>
<%@ taglib uri="/WEB-INF/tld/sys.tld" prefix="sys" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <c:set var="ctx" value="${pageContext.request.contextPath}"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>呼叫记录</title>
    <jsp:include page="../../import.jsp" flush="true"/>
</head>

<body class="iframeBody">
<div class="Wrapper">
    <div class="searchArea">
        <form id="searchBar">
            <div class="fieldset1 clearFix">
                <div class="fieldBox">
                    <div class="label">主叫号</div>
                    <div class="field">
                        <input name="searchCallerNo" id="searchCallerNo" type="text" class="ui-textbox" value="">
                    </div>
                </div>
                <div class="fieldBox">
                    <div class="label">被叫号</div>
                    <div class="field">
                        <input name="searchCalleeNo" id="searchCalleeNo" type="text" class="ui-textbox" value="">
                    </div>
                </div>
                <div class="fieldBox">
                    <div class="label">虚拟号</div>
                    <div class="field">
                        <input name="searchYNo" id="searchYNo" type="text" class="ui-textbox" value="">
                    </div>
                </div>
                <div class="fieldBox">
                    <div class="label">被叫人</div>
                    <div class="field">
                        <input name="searchCalleeNm" id="searchCalleeNm" type="text" class="ui-textbox" value="">
                    </div>
                </div>

                <div class="fieldBox">
                    <div class="label">订单ID</div>
                    <div class="field">
                        <input name="searchMappingId" id="searchMappingId" type="text" class="ui-textbox" value="">
                    </div>
                </div>

                <div class="fieldBox">
                    <div class="label">事业部</div>
                    <div class="field">
                        <div class="field">
                            <select name="searchBuOrgCd" id="searchBuOrgCd">
                                <option value="" seleted>请选择</option>
                                <c:forEach items="${orgListList}" var="orgCd">
                                    <option value="${orgCd.key}">${orgCd.value}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>
                </div>

                <div class="fieldBox">
                    <div class="label">申请人</div>
                    <div class="field">
                        <input name="searchInitiatorNm" id="searchInitiatorNm" type="text" class="ui-textbox" value="">
                    </div>
                </div>


                <div class="clearFix"></div>
                <div class="btnsBox formBtns notRight">
                    <span id="searchBtn" class="sq-button-round">查询</span>
                    <span id="clearBtn" class="sq-button-round">清空</span>
                    <input id="resetBtn" type="reset" value="重置" class="l-button l-button-reset Hide"/>
                </div>
            </div>
        </form>
    </div>
</div>
<div id="ligergrid1" class="sq-grid"></div>

<script type="text/javascript">

    var grid = null
    $(function () {
        initForm();
        initGrid();//注意初始化要在initForm之后,因为在初始化grid的时候需要form参数
        searchBtnEvent();
        clearBtnEvent();
    });

    //初始化表单
    function initForm(){
        $("#searchBar").ligerForm();
    }

    //初始化列表
    function initGrid() {
        $("#ligergrid1").ligerGrid({
            url: '<%=path%>/communication/nopcallbillinfo/initList.do',
            method: 'get',
            parms:getSearchParams(),
            columns: [
                {display: '主叫', name: 'callerNo', width: 130},
                {display: '虚拟号', name: 'xno', width: 130},
                {display: '被叫', name: 'calleeNo', width: 130},
                {display: '接通时间', name: 'startTm', width: 130, render: renderDate, enabledSort: false},
                {display: '通话时长', name: 'callDuration', width: 130},
                {display: '呼叫来源', name: 'bId', width: 130},
                {display: '呼叫渠道', name: 'callChannel', width: 100},
                {display: '是否录音', name: 'needRecord', width: 100,
                    render:function (rowdata, rowindex, value){
                        return (value == "1")?"是":"否";
                    }
                },
                {display: '呼叫状态', name: 'callResultNm', width: 100},
                {display: '订单ID', name: 'mappingId', width: 80},
                {display: '是否显号', name: 'icDisplayFlag', width: 80,
                    render:function (rowdata, rowindex, value){
                        var h="不显号";
                        if("0" == value){
                            h="显示真实号码"
                        }else if("1" == value){
                            h="显示虚拟号码"
                        }else if("2" == value){
                            h="显示主叫号码"
                        }else if("3" == value){
                            h="显示被叫号码"
                        }
                        return h;
                    }
                 },
                {display: '事业部', name: 'buOrgCdNm', width: 150},
                {display: '申请人', name: 'initiatorNm', width: 80},
                {display: '被叫人', name: 'calleeNm', width: 200},
                {
                    display: '附件', width: 180, align: 'center', enabledSort: true,
                    render: function (rowdata, rowindex, value, column) {
                        var k = '';
                        if(null != rowdata.recordAbsPath){
                            k = '<a href="javascript:downloadData(';
                            k += "'" + rowdata.recordAbsPath + "'";
                            k += ')">下载录音</a>';
                        }
                        return k;
                    }
                }
            ],
            pageSize: 10,
            root: 'rows',
            record: 'total',
            hideLoadButton: true,
            width: '100%',
            height: '100%',
            heightDiff: -2,
            checkbox: true,
            rownumbers: true,
            onAfterShowData: function () {
                $(".gridTip").grid_ligerTip();
                SetIframe_height();
            }
        });
        grid = liger.get("ligergrid1");
        grid.setHeight(100);
    }

    //格式化时间
    function renderDate(rowdata, index, value) {
        var dateStr = "";
        if (null != value) {
            var date = new Date(value);
            dateStr = DateUtils.formatDate(date, DateUtils.YYYY_MM_DDHHMMSS);
        }
        return dateStr;
    }

    //查询按钮事件
    function searchBtnEvent(){
        $("#searchBtn").click(function(event) {
            var form = new liger.get("searchBar");
            var data = form.getData();
            for (name in data){
                grid.setParm(name,data[name]);
            };
            grid.reload();
        });
    }

    //清空按钮事件
    function clearBtnEvent(){
        $("#clearBtn").click(function(event) {
            $("#resetBtn").click();  //重置 input-text
            var form = liger.get("searchBar");
        });
    }


    function downloadData(url) {
        var actoinURL = '<%=path%>/communication/nopcallbillinfo/zipDownload.do';
        var form = $("<form>");
        $('body').append(form);
        form.attr('style', 'display:none');
        form.attr('target', '');
        form.attr('method', 'post');
        form.attr('action', actoinURL);//下载文件的请求路径
        var input = $('<input>');
        input.attr('type', 'hidden');
        input.attr('name', 'abcUrl');
        input.attr('value', url);
        form.append(input);
        form.submit();
    }

    //查询参数
    function getSearchParams(){
        var form = new liger.get("searchBar");
        var data = form.getData();
        return data;
    }

</script>

</body>
</html>